<template lang="pug">
  .mask(v-show='isShow')
    .wrap
      .w-title
        .wt-add 添加关键词
        .wt-close(@click="hide()") ×
      .addkey
        el-form(:model="ruleForm"  :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm")
          el-form-item(label="选择行业" prop="industry")
            el-select(v-model="ruleForm.industry" placeholder="选择行业")
              el-option(v-for="(i,j) in industrylist" :key="j" :label="i.industryName" :value="i.id" )
          el-form-item(label="选择单位" prop="organizationName")
            el-select(v-model="ruleForm.organizationName" placeholder="选择单位")
              el-option(v-for="(i,j) in corplist" :key="j" :label="i.organizationName" :value="i.id" )
          el-form-item(label="导入关键词" prop="upload")
            el-upload(action="xyssoManager/filterKeyWord/addUploadFileURL" :on-success="handleSuccess"  accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" multiple=false style="width:100%;border:1px solid #bfcbd9;border-radius:3px;")
              i.el-icon-plus(style="text-indent:5px;") 导入
      .btns
        el-button(type="danger" @click="submitForm('ruleForm')") 添加
        el-button(@click="hide()")  取消
</template>
<script>
  import qs from 'qs';
  export default {
    name:'filterkeyword',
    props:['filterkeyword'],
    data(){
      return{
        isShow:this.filterkeyword,
        industrylist: [],
        corplist: [],
        fileUrl:'',
        ruleForm:{
          industry:'',
          organizationName:'',
          upload:''
        },
        rules: {
          industry: [
            { required: true, message: '请输入行业', trigger: 'change' },
          ],
          organizationName: [
            { required: true, message: '请输入单位', trigger: 'change' },
          ],
          upload: [
            { message: '请导入', trigger: 'change' }
          ],
        }
      }
    },
    mounted(){
      this.queryindustry()
      this.querycorp()
    },
    methods:{
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.addfilterkeyword()
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      async addfilterkeyword(){
        let list = {
          industryId:this.ruleForm.industry,
          organizationCode:this.ruleForm.organizationName,
          filterKeyUrl:this.fileUrl
        }
        let res = await this.$ajax.post('xyssoManager/filterKeyWord/insert',list)
        let data = res.data
        if(data.code==200){
          this.$message.success('添加成功')
          this.isShow = false
          this.$parent.getfilterkeywordlist()
        }
      },
      hide(){
        this.isShow = false
      },
      async queryindustry() {
        let res = await this.$ajax.get('xyssoManager/industry/queryAll')
        this.industrylist = res.data.data
      },
      async querycorp() {
        let res = await this.$ajax.get('xyssoManager/corp/queryCorp')
        this.corplist = res.data
      },
      handleSuccess(response, file, fileList) {
        document.getElementsByClassName('el-upload-list--text')[0].style.display = 'none';
        this.$message.success('上传成功')
        this.fileUrl = response
      }
    },
    watch:{
      filterkeyword(cur){
        if(cur==true){
          this.isShow=cur
        }
      }
    }
  }
</script>
<style lang="stylus" scoped>
  .mask
    position fixed
    top 0
    left 0
    right 0
    bottom 0
    background rgba(0, 0, 0, 0.5)
    .wrap
      position absolute
      top 50%
      left 50%
      width 400px
      height 342px
      margin-left -200px
      margin-top -171px
      background white
      border-radius 5px
      .w-title
        height 50px
        line-height 50px
        border-bottom 1px solid #eaeaea
        color #333333
        .wt-add
          float left
          font-size 16px
          margin-left 20px
        .wt-close
          float right
          margin-right 20px
          font-size 36px
          color #9d9d9d
          cursor pointer
    .addkey
      padding 30px 0 10px
      background #ffffff
      .demo-ruleForm
        margin 0 auto
        width 350px
        .el-input
        .el-select
          width 100%
    .btns
      margin-top 10px
      text-align center
      button
        width 76px
    .el-icon-plus
      padding-left 20px
      color #48576a
      font-size 12px
      &:before
        position relative
        left -10px
    .el-form-item__content
      border 1px solid #000
</style>


